<!--
校验密码popover,校验后显示人员详情
-->
<template>
  <el-popover placement="top" width="320" trigger="click">
    <el-form ref="form" :model="formData" inline @submit.native.prevent>
      <el-form-item>
        <PasswordInput
          @keyup.enter.native="confirm"
          v-model="formData.curuser_pwd"
          :placeholder= "$t('common.inputCurrentPwdPromit')"
        />
      </el-form-item>
    </el-form>
    <slot slot="reference" />
    <div slot="reference" v-if="isShow" class="eye" />
  </el-popover>
</template>

<script>
import PasswordInput from "@/components/input/Password.vue";
import { validatePwd ,getDetailInfo} from "@/services";
export default {
  props:{
    personInfo:{
      type:Object,
      default:()=>({})
    }
  },
  components:{
    PasswordInput
  },
  data() {
    return {
      isShow: true,
      formData: {},
    };
  },
  methods: {
    async confirm() {
      const params = {
        userpasswd: this.formData.curuser_pwd,
      };
      const res = await validatePwd(params);
      if(res.code == 0) {
          const params = {
            lib_id: this.personInfo.lib_id,
            uuid: this.personInfo.img_id,
          };
        const res = await getDetailInfo(params);
        this.$emit("confirm", res);
      }
    },
  },
};
</script>

<style lang="less" scoped>
.eye {
  width: 20px;
  height: 10px;
  margin-left: 10px;
  background: url("../assets/eye.png") no-repeat;
  background-size: 100% 100%;
  cursor: pointer;
}
</style>
